<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="">
  <meta name="author" content="Dashboard">
  <meta name="keyword" content="Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">
  <title>Dashio - Bootstrap Admin Template</title>
  <!-- Favicons -->
  <link href="${pageContext.request.contextPath }/img/favicon.png" rel="icon">
  <link href="${pageContext.request.contextPath }/img/apple-touch-icon.png" rel="apple-touch-icon">
  <!-- Bootstrap core CSS -->
  <link href="${pageContext.request.contextPath }/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <!--external css-->
  <link href="${pageContext.request.contextPath }/lib/font-awesome/css/font-awesome.css" rel="stylesheet" />
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/zabuto_calendar.css">
  <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/lib/gritter/css/jquery.gritter.css" />
  <!-- Custom styles for this template -->
  <link href="${pageContext.request.contextPath }/css/style.css" rel="stylesheet">
  <link href="${pageContext.request.contextPath }/css/style-responsive.css" rel="stylesheet">
  <script src="${pageContext.request.contextPath }/lib/chart-master/Chart.js"></script>

  <!-- =======================================================
    Template Name: Dashio
    Template URL: https://templatemag.com/dashio-bootstrap-admin-template/
    Author: TemplateMag.com
    License: https://templatemag.com/license/
  ======================================================= -->
</head>

<body>
  <section id="container">
    <!-- **********************************************************************************************************************************************************
        TOP BAR CONTENT & NOTIFICATIONS
        *********************************************************************************************************************************************************** -->
    <!--header start-->
    <header class="header black-bg">
      <div class="sidebar-toggle-box">
        <div class="fa fa-bars tooltips" data-placement="right" data-original-title="Toggle Navigation"></div>
      </div>
      <!--logo start-->
      <a href="index.jsp" class="logo"><b>BES<span>Manage</span></b></a>
      <!--logo end-->
      <div class="top-menu">
        <ul class="nav pull-right top-menu">
          <li><a class="logout" href="${pageContext.request.contextPath }/back/login.jsp">退出登录</a></li>
        </ul>
      </div>
    </header>
    <!--header end-->
    <!-- **********************************************************************************************************************************************************
        MAIN SIDEBAR MENU
        *********************************************************************************************************************************************************** -->
    <!--sidebar start-->
    <aside>
      <div id="sidebar" class="nav-collapse ">
        <!-- sidebar menu start-->
        <ul class="sidebar-menu" id="nav-accordion">
        	<p class="centered"><a href="index.jsp">
        	<!--管理员头像-->
          <!-- 默认头像 -->
			<c:if test="${sessionScope.backUser.u_img ==null}">
				<img  src="${pageContext.request.contextPath }/images/ui-sam.jpg" class="img-circle" width="80" />
			</c:if>
			<!-- 自定义头像 -->
			<c:if test="${sessionScope.backUser.u_img !=null}">
				<img  src="${pageContext.request.contextPath }/DownloadServlet?fileName=${sessionScope.backUser.u_img}"  class="img-circle" width="80" />
			</c:if>
          </a></p>
          <!--管理员名-->
          <h5 class="centered">${sessionScope.backUser.u_name}</h5>
          <li class="mt">
            <a class="active" href="${pageContext.request.contextPath }/back/index.jsp">
              <i class="fa fa-dashboard"></i>
              <span>公司信息</span>
              </a>
          </li>
          <li class="sub-menu">
            <a href="javascript:;">
              <i class="fa fa-desktop"></i>
              <span>用户管理</span>
              </a>
            <ul class="sub">
              <li><a href="${pageContext.request.contextPath }/back/user-information.jsp">用户信息</a></li>
              <li><a href="${pageContext.request.contextPath }/back/adduser.jsp">添加用户</a></li>
            </ul>
          </li>
          <li class="sub-menu">
            <a href="javascript:;">
              <i class="fa fa-tasks"></i>
              <span>车次管理</span>
              </a>
            <ul class="sub">
              <li><a href="${pageContext.request.contextPath }/back/bus-information.jsp">车次信息</a></li>
              <li><a href="${pageContext.request.contextPath }/back/moment-information.jsp">时刻信息</a></li>
              <li><a href="${pageContext.request.contextPath }/back/addmoment.jsp">添加时刻表</a></li>
              <li><a href="${pageContext.request.contextPath }/back/addsite.jsp">添加车次</a></li>  
            </ul>
          </li>
          <li class="sub-menu">
            <a class="active" href="javascript:;">
              <i class="fa fa-th"></i>
              <span>站点管理</span>
              </a>
            <ul class="sub">
              <li><a href="${pageContext.request.contextPath }/back/bussite-information.jsp">站点信息</a></li>
              <li><a href="${pageContext.request.contextPath }/back/addbussite.jsp">添加站点</a></li>
              <li class="active"><a href="${pageContext.request.contextPath }/back/addbusSites.jsp">新增站点</a></li>
            </ul>
          </li>
    
          <li class="sub-menu">
            <a href="javascript:;">
              <i class="fa fa-comments-o"></i>
              <span>公告栏管理</span>
              </a>
            <ul class="sub">
              <li><a href="${pageContext.request.contextPath }/back/announcement.jsp">公告栏信息</a></li>
            </ul>
          </li>
          <li>
            <a href="${pageContext.request.contextPath }/back/baidu_maps.jsp">
              <i class="fa fa-map-marker"></i>
              <span>百度地图</span>
              </a>
          </li>
        </ul>
        <!-- sidebar menu end-->
      </div>
     <!--sidebar start-->
    </aside>
     <!--sidebar end-->
    <!--main content start-->
    <section id="main-content">
      <section class="wrapper">
       
          <div class="col-sm-4">
            <h4 class="title">添加站点</h4>
            <form class="cmxform form-horizontal style-form" id="signupForm" method="post" action="${pageContext.request.contextPath }/SiteController?op=add" >
                  <div class="form-group">
                    <label for="firstname" class="control-label col-lg-2">站点名</label>
                    <div class="col-lg-4">
                      <input class=" form-control" id="b_name" name="b_name" type="text" />
                    </div>
                    <div class="col-lg-2">
                      	<button class="btn btn-theme" id="btn" type="button">提交</button>
                      </div>
                  </div>
                </form>
            <!-- contact_details -->
          </div>
        <div class="col-sm-8">
						<div class="content-panel">
							<table class="table table-striped table-advance table-hover">
								<h4>
									<i class="fa fa-angle-right"></i>站点表
								</h4>
								<hr>
								<thead>
									<tr>
										<th>站点编号</th>
										<th>站点名</th>
										<th><i class=" fa fa-edit"></i>操作</th>
									</tr>
								</thead>
								<tbody id="articlist">
									<%-- <c:forEach items="${requestScope.site}" var="site">
										<tr>
											<td>${site.s_id}</td>
											<td>${site.s_name}</td>
											<td>${site.b_id }</td>
											<td>${site.s_location }</td>
											<td>
												<button id="up" class="btn btn-primary btn-xs">
													<i class="fa fa-pencil"></i>
												</button> <a href="Javascript:delFun(${site.s_id })"><button
														id="rmv" class="btn btn-danger btn-xs">
														<i class="fa fa-trash-o "></i>
													</button></a>
											</td>
										</tr>
									</c:forEach> --%>
								</tbody>
							</table>
							<!-- 分页信息 -->
							<div id="showPageInfo"></div>
							<!-- 分页实现    -->
							<div class="col-md-12 text-center">
								<!-- 设置居中 -->
								<ul class="pagination" id="pageItem">

								</ul>
							</div>
							<!-- /content-panel -->
						</div>
						<!-- /col-md-12 -->
					</div>
        <!-- /row -->
      </section>
      <!-- /wrapper -->
    </section>
    <!-- /MAIN CONTENT -->
    <!--main content end-->
    <!--footer start-->
    <footer class="site-footer">
      <div class="text-center">
        <p>&copy; Copyrights <strong>Dashio</strong>. All Rights Reserved</p>
        <div class="credits"> Created with Dashio template by <a href="https://templatemag.com/">TemplateMag</a></div>
        <a href="index.jsp#" class="go-top">
          <i class="fa fa-angle-up"></i>
          </a>
      </div>
    </footer>
    <!--footer end-->
  </section>
  <!-- js placed at the end of the document so the pages load faster -->
  <script src="${pageContext.request.contextPath }/lib/jquery/jquery.min.js"></script>

  <script src="${pageContext.request.contextPath }/lib/bootstrap/js/bootstrap.min.js"></script>
  <script class="include" type="text/javascript" src="${pageContext.request.contextPath }/lib/jquery.dcjqaccordion.2.7.js"></script>
  <script src="${pageContext.request.contextPath }/lib/jquery.scrollTo.min.js"></script>
  <script src="${pageContext.request.contextPath }/lib/jquery.nicescroll.js" type="text/javascript"></script>
  <script src="${pageContext.request.contextPath }/lib/jquery.sparkline.js"></script>
  <!--common script for all pages-->
  <script src="${pageContext.request.contextPath }/lib/common-scripts.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath }/lib/gritter/js/jquery.gritter.js"></script>
  <script type="text/javascript" src="${pageContext.request.contextPath }/lib/gritter-conf.js"></script>
  <!--script for this page-->
  <script src="${pageContext.request.contextPath }/lib/sparkline-chart.js"></script>
  <script src="${pageContext.request.contextPath }/lib/zabuto_calendar.js"></script>
</body>
<script type="text/javascript">
$(function(){
	//请求ajax
	$.get("${pageContext.request.contextPath}/SiteController",{op:"ajaxsite"},function(data){
		showData(data);
	},"json")
	    	//首页
    	$(document).on("click",".first",function(){
    		//发送ajax请求
    		$.get("${pageContext.request.contextPath}/SiteController",{op:"ajaxsite",pageNo:1,pageSize:3},function(data){
    		showData(data);
    	},"json")
    	})
    	//末页
    	$(document).on("click",".last",function(){
    		var totalPage=$("#totalPage").text();
    		//发送ajax请求
    		$.get("${pageContext.request.contextPath}/SiteController",{op:"ajaxsite",pageNo:totalPage,pageSize:3},function(data){
    		showData(data);
    	},"json")
    	})
    	//下一页
    	$(document).on("click",".next",function(){
    		var pageNo=$("#pageNo").text();
    		//发送ajax请求
    		$.get("${pageContext.request.contextPath}/SiteController",{op:"ajaxsite",pageNo:(parseInt(pageNo)+1),pageSize:3},function(data){
    		showData(data);
    	},"json")
    	})
    	//每一页
    	$(document).on("click",".currentPage",function(){
    		var pageNo=$(this).text();
    		//发送ajax请求
    		$.get("${pageContext.request.contextPath}/SiteController",{op:"ajaxsite",pageNo:pageNo,pageSize:3},function(data){
    		showData(data);
    	},"json")
    	})
    	//跳转
    	$(document).on("click",".turnto",function(){
    		//获取number的值
    		var pageNo=$("#turntoId").val();
    		//获取末页值
    		var totalPage=$("#totalPage").text();
    		if(pageNo<1){
    			pageNo=1;
    			$("#turntoId").val(pageNo);
    		}else if(pageNo>totalPage*1){
    			pageNo=totalPage;
    			$("#turntoId").val(pageNo);
    		}
    		//发送ajax请求
    		$.get("${pageContext.request.contextPath}/SiteController",{op:"ajaxsite",pageNo:pageNo,pageSize:3},function(data){
    		showData(data);
    	},"json")
    	})
})
function showData(data){
	//清空
	$("#articlist").empty();
	$("#showPageInfo").empty();
	$("#pageItem").empty();
	//拼接
	$.each(data.data,function(i,site){
		$("#articlist").append( " <tr>\r\n" + 
				"                    <td>"+site.s_id+"</td>\r\n" + 
				"                    <td>"+site.s_name+"</td>\r\n" + 
				"                    <td>  <a href=\"Javascript:delFun("+site.s_id+")\"><button id=\"rmv\" class=\"btn btn-danger btn-xs\"><i class=\"fa fa-trash-o \"></i></button></a>\r\n" + 
				"                    </td>\r\n" + 
				"                  </tr>")
	})
	//显示信息
	$("#showPageInfo").append("当前第<span id='pageNo'>"+data.pageNo+"</span>页/共<span id='totalPage'>"+data.totalPage+
            "</span>页/每页显示<span id='pageSize'>"+data.pageSize+"</span>条/共<span id='totalCount'>"+data.totalCount+"</span>条数据");
	//首页
	if(1==data.pageNo){
		$("#pageItem").append('<li class="disabled"><a href="#">首页</a></li>');
	}else{
		   $("#pageItem").append('<li><a href="#" class="first">首页</a></li>');
	   }
	for(var i=1;i<=data.totalPage;i++){
		   if(i==data.pageNo){
			   $("#pageItem").append('<li class="active"><a href="#">'+i+'</a></li>');
		   }else{
			   $("#pageItem").append('<li><a href="#" class="currentPage">'+i+'</a></li>');
		   } 
	   }
	//下一页
	if(data.pageNo==data.totalPage){
		$("#pageItem").append('<li class="disabled"><a href="#">下一页</a></li>');
	}else{
		$("#pageItem").append('<li><a href="#" class="next">下一页</a></li>');
	}
	 //末页 
	   if(data.pageNo==data.totalPage){
		   $("#pageItem").append('<li class="disabled"><a href="#">末页</a></li>');
	   }else{
		   $("#pageItem").append('<li><a href="#" class="last">末页</a></li>');
	   }
	 //跳转
	  $("#pageItem").append('<li><a href="#"><input type="number" id="turntoId" value="'+data.pageNo+'" min="1" max="'+data.totalPage+
	'" style="width:40px;height:20px"/></a></li>');
  $("#pageItem").append('<li><a href="#" class="turnto">跳转</a></li>');
}
function delFun(sid){
	 var b=confirm("是否确定删除编号为:"+sid);
	 if(b){
	$.post("${pageContext.request.contextPath}/SiteController",{op:"ajaxdel",sid:sid},function(data){
		if(data){
		var pageNo=0;
		var pageSize=$("#pageSize").text();		
		var totalCount=$("#totalCount").text();
		if(totalCount%pageSize==0){
			pageNo=$("#pageNo").text()-1;
		}else{
			pageNo=$("#pageNo").text();
		}
			$.get("${pageContext.request.contextPath}/SiteController",{op:"ajaxsite",pageNo:pageNo,pageSize:3},function(data){
	    		showData(data);
	    	},"json")
		}
	})
	 }else{
		 alert("删除失败");
	 }
}
//增加站点
$("#btn").click(function(){
	//请求ajax
	$.get("${pageContext.request.contextPath}/SiteController",{op:"add",b_name:$("#b_name").val()},function(data){
		if(data){
			var pageNo=$("#totalPage").text();
			$.get("${pageContext.request.contextPath}/SiteController",{op:"ajaxsite",pageNo:pageNo,pageSize:3},function(data){
	    		showData(data);
	    	},"json")
		}
	},"json")
})
</script>
</html>